<template>
  <div>
    <el-col :span="24">

      <el-row>
        <div align="center"><h1>群机器人发送群消息</h1></div>
      </el-row>

      <el-row>
        <el-col :span="2"><div class="grid-content">&nbsp;</div></el-col>
        <el-col :span="4"><div class="grid-content">

          <h3>当前用户</h3>

          <el-tag style="font-size: 20px"><b>{{ getuser }}</b></el-tag> 


           <h3>选择群:</h3></div>
        </el-col>
      </el-row>

      <el-row>
        <el-col :span="2"><div class="grid-content">&nbsp;</div></el-col>
        <el-col :span="20"><div class="grid-content">
        <template>
          <el-select v-model="value" filterable placeholder="请选择" style="width:80%" >
            <el-option
              v-for="item in options"
              :key="item.value"
              :label="item.label"
              :value="item.value">
            </el-option>
          </el-select>
        </template>



           <h3>请输发送的内容:</h3>
          
          <el-input v-model="image"  type="textarea"  rows="10" placeholder="# 温馨提醒：   
### 最近疫情起伏,建议大家：
### 1. 随身携带笔记本电脑
### 2. 收到系统密码到期提醒的请及时更改
**如有问题请及时联系IT服务中心.**
![alt 啊](https://img1.baidu.com/it/u=884550464,61617669&fm=253&fmt=auto&app=138&f=PNG?w=580&h=436)" style="width:80%" />
          <br><br>
          <el-button type="primary" style="width:20%" icon="el-icon-top" @click="sumbit">提交发送</el-button>
          <br><br>
          </div>
          <div v-show="play" v-highlight>
            <pre><code class="javascript" v-html="message2" /></pre>
          </div>
          <div  v-highlight >
            <pre><code class="markdown" v-html="message" /></pre>
          </div>


          <!-- <el-button type="primary" style="width:20%" icon="el-icon-top" @click="copyText" v-show="play">复制</el-button> -->

        </el-col>
      </el-row>



    </el-col>
  </div>

</template>

<script>
import { decryption } from '@/api/query'

export default {
  data() {
    return {
        options: [{
                  value: '1',
                  label: '测试群'
                }, {
                  value: '2',
                  label: 'IT服务中心'
                }, {
                  value: '3',
                  label: '米家大家庭'
                },{
                  value: '4',
                  label: '运维/IT通知群'
                }],
                value: '1',
      image: '',
      message: 'markdown语法说明如下：\n\n# 一级标题\n## 二级标题\n### 三级标题\n#### 四级标题\n##### 五级标题\n###### 六级标题\n\n\n引用\n> A man who stands for nothing will fall for anything. \n\n文字加粗、斜体\n**bold**\n*italic* \n\n链接\n[this is a link](http://name.com) \n\n图片\n![](http://name.com/pic.jpg) \n\n无序列表\n- item1\n- item2 \n\n有序列表\n1. item1\n2. item2\n',
      // markdown:"1111",
      message2:'',
      play: false,
      msg:'加载中',
      getuser : 'admin'
    }
  },
  created() {
    this.GetUser()
  },
  // computed:{

  //   },
  methods: {
    sumbit() {
      this.play = true
      console.log(this.value)
      console.log(this.image)
      decryption({ 'value': this.value, 'content': this.image, 'name': this.getuser}).then(response => {
        console.log(response.data)
        this.message2 = response.data
      })
    },
      GetUser(){
            console.log(this.$store.state.user.token)
            this.getuser =  this.$store.state.user.token
        }
    // copyText(){
    //   var input = document.createElement("input");   // js创建一个input输入框
    //   input.value = this.message2;  // 将需要复制的文本赋值到创建的input输入框中
    //   document.body.appendChild(input);    // 将输入框暂时创建到实例里面
    //   input.select();   // 选中输入框中的内容
    //   document.execCommand("Copy");   // 执行复制操作
    //   document.body.removeChild(input); // 最后删除实例中临时创建的input输入框，完成复制操作
    //   this.$message({
    //             message: '复制完成',
    //             type: 'success',
    //             offset: 80,
    //           });
    // },
    // getversion() {
    //   getversion({ 'name': this.GetUser}).then(response => {
    //     console.log(response.data)
    //     this.options = response.data
    //     // this.value= response.data.podname
    //   })
    // },
  }
}
</script>

<style scoped>
.el-col {
  min-height: 1px
}
</style>
